<template>
  <div class="header">
    <h1 ref="headerEle">Header</h1>
    <button @click="getRef">获取元素</button>
    <button @click="showPerson">打印props拿到的值</button>
  </div>
</template>

<script>
export default {
  props: ["name", "age", "sex"],
  name: "MyHeader",
  methods: {
    getRef() {
      console.log(this);
      console.log(this.$refs);
    },
    showPerson() {
      console.log(this.name, this.age, this.sex);
    },
  },
};
</script>

<style scoped>
.header {
  height: 100px;
  background-color: pink;
}
</style>